<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<title>jQuery EasyUI</title>
		<link rel="stylesheet" type="text/css" href="../themes/default/easyui.css">
		<link rel="stylesheet" type="text/css" href="../themes/icon.css">
		<script type="text/javascript" src="../jquery-1.4.4.min.js"></script>
		<script type="text/javascript" src="../jquery.easyui.min.js"></script>


		<script type="text/javascript">
		$(function(){
			$('#tt').datagrid({
				title:'Frozen Columns',
				iconCls:'icon-save',
				width:500,
				height:250,
				url:'frozen_datagrid_data.json',
				frozenColumns:[[
					{field:'itemid',title:'Item ID',width:80},
					{field:'productid',title:'Product ID',width:80}
				]],
				columns:[[
				{field:'itemid',title:'Item ID',width:80},
					{field:'productid',title:'Product ID',width:80},
					{field:'listprice',title:'List Price',width:80,align:'right'},
					{field:'unitcost',title:'Unit Cost',width:80,align:'right'},
					{field:'attr1',title:'Attribute',width:100},
					{field:'status',title:'Status',width:60}
				]]
			});
		});
	</script>
	</head>
	<body>
		<h1>
			Frozen Columns for DataGrid
		</h1>
		<table id="tt">
		</table>

	</body>
</html>